@import "../../app/variable.less";
.wl-gift-cards{
    padding: 2vh;
    .fv1();
    .notice{
        font-family: "HXBhandsome";
        margin-bottom: 2vh;
        display: flex;
        align-items: flex-end;
        >span{
            font-size: 1.5vh;
            color: @cr-white;
            text-shadow: 0px 2px 6px @cr-red-a50;
            padding-bottom: 0.2vh;
        }
        >h2{
            font-size: 3.6vh;
            padding-left: 1vh;
            // color: @cr-brightYellow;
            animation: highlight 2s ease-in-out infinite;
            text-shadow: 0px 2px 6px @cr-white-a75;
            &.plr{
                padding: 0 1vh;
            }
        }
    }
    .card{
        width: 25vh;
        height: 8vh;
        margin-bottom: 1vh;
        overflow: hidden;
        background-color: transparent;
        &.active{
            position: relative;
            .card-inner{
                background-image: url(../../../public/images/rectangle-selected.png);
                .card-box{
                    &.card-cover{
                        background-image: url(../../../public/images/gift-selected.png);
                    }
                }
            }
        }
        .card-inner{
            width: 100%;
            height: 100%;
            padding: 0 2vh;
            box-sizing: border-box;
            background-image: url(../../../public/images/rectangle.png);
            .bg-cover();
            .fh2();
            .card-box{
                width: calc(100% - 8vh);
                &.card-cover{
                    width: 6vh;
                    height: 6vh;
                    border-radius: 50%;
                    overflow: hidden;
                    background-image: url(../../../public/images/gift.png);
                    .bg-cover();
                }
                &.card-body{
                    .card-title{
                        font-size: 1.6vh;
                        font-family: "HXBhandsome";
                        color: @cr-white;
                    }
                    .card-content{
                        font-family: "zcoolkangyuyang_w01";
                        margin-top: 0.8vh;
                        >b{
                            margin-right: 1vh;
                        }
                        >b, >span{
                            font-weight: 600;
                            font-size: 1.3vh;
                            text-shadow: 0px 2px 6px @cr-red-a50;
                            color: @cr-white;
                        }
                    }
                }
            }
        }
    }
}
